﻿@model Windshield.ViewModels.LobbyViewModel
<script src="@Url.Content("~/Scripts/GameLobby.js")" type="text/javascript"></script>

<div class="row-fluid">
	<h2>Lobby</h2>
</div>
<div class="row-fluid">
	<div class="span4">
		<div class="row-fluid">
			<h3>@Model.theName</h3>
			<hr>
			<div class="text-center">
				@Html.Partial("_GameImagePartial", new Windshield.Models.Game { image = Model.Image })
			</div>
		</div>
	</div>
	<div class="span4">
		<div id="game-on-players" class="row-fluid">
			<h3>Players</h3>
			<hr>
			<span id="board-id" style="display:none;">@Model.boardId</span>
			<!-- "Container" for the javascript -->
			<ul id="player-list">
				<!-- users in lobby will be loaded here -->
				<!-- foreach (var user in Model.guests)
				{
					<li> user.UserName </li>
				} -->
			</ul>
		</div>
		<div class="row-fluid btn-group lobby-buttons text-center">
			@if (Model.ownerName == User.Identity.Name)
			{
			@Html.ActionLink("Start", "StartGame", "Games", new { idBoard = @Model.boardId }, new { @class = "btn", id = "start-game-button1" })
			}
			@Html.ActionLink("Cancel", "Index", new { controller = "Home" }, new { @class = "btn" })
			<!--Html.ActionLink("Start","Index","Games")-->
		</div>
	</div>
	<script id="lobby-template" type="text/html">
		<li class="list-of-players">${UserName}</li>
	</script>

	<div class="span4">
		<div id="chat-wrapper" class="container-fluid visible-desktop">
			@Html.Partial("Chat", Model.boardId)
		</div>
	</div>
</div>
